<template>
    <el-container class="layout-container-demo">
        <el-aside class="aside">

            <el-scrollbar>
                <el-menu :default-openeds="['1','2','3']">
                    <el-sub-menu index="1">
                        <!-- 考试管理 -->
                         <template #title>
                            <span class="title">考试管理</span>
                         </template>
                         <el-menu-item-group>
                            <el-menu-item index="1-1">
                                <!-- 查看组卷 -->
                                 <router-link to="/teacher/exam"><span class = "topic">查看组卷</span></router-link>
                            </el-menu-item>
                            <el-menu-item index="1-2">
                                <!-- 新增组卷 -->
                                 <router-link to="/teacher/examAdd"><span class = "topic">新增组卷</span></router-link>
                            </el-menu-item>
                         </el-menu-item-group>
                    </el-sub-menu>
                    <el-sub-menu index="2">
                        <!-- 题目管理 -->
                         <template #title>
                            <span class="title">题库管理</span>
                         </template>
                         <el-menu-item-group>
                            <el-menu-item index="2-1">
                                <!-- 查看题库 -->
                                 <router-link to="/teacher/question"><span class = "topic">查看题库</span></router-link>
                            </el-menu-item>
                            <el-menu-item index="2-2">
                                <!-- 新增题目 -->
                                 <router-link to="/teacher/questionAdd"><span class = "topic">新增题目</span></router-link>
                            </el-menu-item>
                           
                         </el-menu-item-group>
                    </el-sub-menu>
                    <el-sub-menu index="3">
                        <!-- 成绩查看 -->
                        <template #title>
                            <span class="title">成绩查看</span>
                         </template>
                         <el-menu-item-group>
                            <el-menu-item index="3-1">
                                <!-- 查看成绩 -->
                                 <router-link to="/teacher/examScores"><span class = "topic">查看成绩</span></router-link>
                            </el-menu-item>
                         </el-menu-item-group>
                    </el-sub-menu>
                </el-menu>
            </el-scrollbar>
        </el-aside>

        <!-- 视图区 -->
    <el-container>
        <el-main>
            <router-view/>
        </el-main>
    </el-container>

    </el-container>
</template>

<script setup>
import {RouterView} from 'vue-router';

</script>

<style scoped>
.layout-container-demo{
    width: 100%;
    height: 100%;/* 
    background-color: aquamarine; */
}

.el-aside{
    width: 15%;
    height: 100%;
}
.title{
    font-size:24px;
    margin:auto;
}

.topic{
    font-size:22px;
    margin:0 50% 0;
}

</style>